<template>
  <view class="page">
 

		<view class="base mar-bottom66">
      <view class="flex align-center ">
      <!--  <u-icon
          @click="baseMore = true"
          v-if="!baseMore"
          name="arrow-down"
          size="14"
          color="#999999"
          labelPos="left"
          labelSize="14"
        ></u-icon>
        <u-icon
          @click="baseMore = false"
          v-else
          name="arrow-up"
          size="14"
          color="#999999"
          labelPos="left"
          labelSize="14"
        ></u-icon> -->
        <view class="cr-333 font_s32 font_w500 mar-left12">{{favorites.favoritesName}}</view>
				<view class="font_s26 cr-999 mar-left6"><text class="mar-right6">·</text>
				<text  v-if="list.length">{{list.length}}</text>
				<text v-else>0</text>
				</view>
      </view>
      <view class="menu-box" v-if="baseMore">
        <view class="menu-item" v-for="item in list" >
					<view class=" mar-bottom23 flex justify-between align-center" >
						<view class="font_s26 cr-333" @click="handleJump(item)"> {{item.contentItemName}} </view>
						<view class="action-btn-box">
							<u-tooltip @click="(index)=>{handleClickChildrenTip(item,favorites,index)}" :ref='item.id' class="tip"  :buttons="['删除','转发','移动到收藏夹']" bgColor="#e3e4e6" :showCopy="false"></u-tooltip>
						<u-icon class="tip-icon" @click.stop="handleShowTip(item.id)" style="transform: rotateZ(270deg);" name="more-dot-fill"></u-icon>
					</view>
					</view>
          
            <view class="font_s24 cr-999" @click="handleJump(item)"> 收藏时间 {{item.createTime}} </view>
					
        </view>
      </view>
    </view>
	<t-favoritespop :show='showFavoritesPopup' :defaultFavorites='favorites' :faChild='computedFaChild' @close='()=>{handleShowFaPopup(false);init()}'></t-favoritespop>
<!-- 	<u-popup
	class="favorites-popup"
	  :show="showFavoritesPopup"
	  mode="bottom"
	  @close="handleUpdateContentCollectionStatus"
	  
	>
	  <view class="favorites-pop padd-top30 padd-left32 padd-right32">
	    <view class="flex justify-between mar-bottom31">
			<view class="font_s28 cr-333 font_w500 ">
				选择收藏夹
			</view>
			<view class="font_s24 cr-999" @click="handleShowCollctPopup(true)">
				<image src="/static/img/icon_add.png" mode="" class="w-21 h-21 mar-right10"></image>
				新建收藏夹
			</view>
		</view>
	    <view class="content ">
	      <view class=" mar-bottom19 item" v-for="item in favoritesList">
			 <radio-group  @change="radioChange">
						<label class="flex justify-between"  >
							
							<view>
								<view class="cr-333 font_s26 mar-bottom17">
									{{item.favoritesName}}
								</view>
								<view class="cr-999 font_s24">
									10个内容
								</view>
							</view>
							<view>
								<radio  :value="`${item.id}`" :checked="activeFavorites?activeFavorites.id==item.id:false" />
							</view>
						</label>
					
			</radio-group>
	      </view>
	    </view>
	  </view>
	</u-popup> -->
  </view>
</template>

<script>
export default {
  data() {
    return {
      baseMore: true,
	  favorites:null,
	  list:[],
	  // favoritesList:[],
	  faChild:null,
	  // activeFavorites:null,
	  showFavoritesPopup:false,
	  // showCeateCollectPopup:false
    };
  },
  onLoad(query) {
  	console.log(query)
    //解码
    const queryObj = Object.keys(query).reduce((pre,key)=>{
        pre[decodeURIComponent(key)]=decodeURIComponent(query[key])
        return pre
      },{})
	this.favorites=queryObj
	this.init()
  },
  onShareAppMessage(res) {
  	console.log(res,url,this.faChild)
  	let url = ''
  	switch (this.faChild.contentItemType) {
  		case 1:
  			url = `imgtxtDetails/imgtxtDetails?id=${this.faChild.contentItemId}`
  			break;
  		case 2:
  			url = `VideoItemDetail/VideoItemDetail?id=${this.faChild.contentItemId}`
  			break;
  		case 3:
  			url = `AudioItemList/AudioItemList?id=${this.faChild. albumId}&cid=${this.faChild.contentItemId}`
  			break;
  		default:
  			break;
  	}
  	return {
  		title: this.faChild.contentItemName,
  		path: `/pages/${url}`
  	}
  },
  computed: {
    computedFaChild(){
      if(this.faChild) return {...this.faChild,id:this.faChild.contentItemId}
    },},
	methods: {
    handleJump(item){
      if(item.deleteStatus){
        uni.showToast({
          title:'内容已删除',
          icon:'none'
        })
        return
      }
      if(!item.publishStatus){
        uni.showToast({
          title:'内容已下架',
          icon:'none'
        })
        return
      }
      let url = ''
      switch(item.contentItemType){
      	case 1:
      	 url = `/pages/imgtxtDetails/imgtxtDetails?id=${item.contentItemId}`
      	break;
      	case 2:
      		url = `/pages/VideoItemDetail/VideoItemDetail?id=${item.contentItemId}`
      	break;
      	case 3:
      		url = `/pages/AudioItemList/AudioItemList?id=${item.albumId}&cid=${item.contentItemId}`
      	break;
      }
      uni.navigateTo({
      	url
      })
    },
		init(){
			this.getFaChildren()
		},
		handleShowTip(id){
			if(this.$refs[id]){
				this.$refs[id][0].longpressHandler()
			}
		},
		//获取收藏夹
		// getUserFavorites() {
		// 	return this.$http.get(
		// 		`/yaolexue-service-portal/userFavorites/findUserFavorites`, {}, {
		// 			isNeedLoading: true
		// 		}).then(res => {
		// 		this.favoritesList = res.data
		// 		this.activeFavorites = res.data.find(item =>item.id== this.favorites.id) || res.data[
		// 			0] 
		// 	})
		
		// },
		//加载收藏夹子项
		
		getFaChildren(){
			
		
			return this.$http.get(
				`/yaolexue-service-portal/userFavorites/findUserFavoritesItemById/${this.favorites.id}`, {}, {
					isNeedLoading: true
				}).then(res => {
			this.list=res.data
			})
		},
		//更新收藏夹
		handleUpdateContentCollectionStatus(collectionStatus=1){
				const collectionParams={
						collectionStatus:collectionStatus,
						contentItemId:this.faChild.id,
						
				}
				if(this.favorites){
					collectionParams.userFavoritesId=+this.favorites.id
				}
			return this.$http.put(
				`/yaolexue-service-portal/contentItem/updateContentCollectionStatus`, collectionParams, {
					isNeedLoading: true
				}).then(res=>{
					
					if(res.code===200){
						this.init()
					}
				})
		},
		//点击收藏夹子项tip
		handleClickChildrenTip(faChild,faParent,clickTypeIndex){
			this.faChild=faChild
			if(clickTypeIndex===0){
				//删除不需要带userFavoritesId
				this.handleUpdateContentCollectionStatus(0)
			}
			if(clickTypeIndex===1){
				//转发
			}
			if(clickTypeIndex===2){
				//移动收藏夹
				// this.activeFavorites=faParent
				this.handleShowFaPopup(true)
			}
		},
	
		// //选择收藏夹
		// radioChange(evt){
		// 	this.activeFavorites=this.favoritesList.find(item=>item.id+''===evt.detail.value)
		
		// },
		//显示收藏夹弹窗
		handleShowFaPopup(flag){
			if(flag){
				// this.getUserFavorites()
				// this.activeFavorites = this.favoritesList.find(item => item.defaultStatus) ||this.favoritesList[
				// 	0] //这里不能这样是因为有很多地方会操作activeFavorites
			}else{
				// this.activeFavorites =null
			}
			this.showFavoritesPopup = flag;
		},
		// handleShowCollctPopup(flag) {
		
		// 	this.showCeateCollectPopup = flag;
		// 	this.favoritesName = ''
		// },
	},
};
</script>

<style lang="scss">

.page {
  padding: 41rpx 31rpx;
}
.base {
	.menu-box{
		width: 689rpx;
		background: #FFFFFF;
		margin: 20rpx auto;
		.menu-item{
			width: 100%;
			padding-bottom: 30rpx;
			padding-top: 30rpx;
			box-sizing: border-box;
				border-bottom: 1rpx solid rgba(240, 240, 240, 0.8);
		}
	}
}
.action-btn-box{
	position: relative;
	.u-icon {
					transform: rotateZ(270deg);
					color: #999999 !important;
				}
				
	.tip,.u-tooltip {
		position: absolute;
		top: 0;
		left: 0;
		/* z-index: -1; */
		width: 50%;
		/* opacity: 0; */
		/* overflow: hidden; */
	}
	::v-deep .tip-icon{
		.u-icon__icon{
			color: #999999 !important;
		}
	}
}
.his-pop{
	.content{
		width: 400rpx;
	}
}

	 .createcollect-pop{
		  width: 400rpx;
		  
		  
	 }
</style>
